<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>修改进场单</title>
        <link href="../img/icon.ico" rel="shortcut icon"/>
		<link rel="stylesheet" href="../layui/css/layui.css" />
        <link rel="stylesheet" href="../css/element.min.css?1" />
        <link rel="stylesheet" href="http://at.alicdn.com/t/font_2315128_5bb2ydgeqs.css">
        <link rel="stylesheet" href="../css/reset.css?3133">
        <link rel="stylesheet" href="../css/setlayui.css?12">
        <link rel="stylesheet" href="../css/viewer.min.css">
		<script src="../layui/layui.all.js"></script>
		<script type="text/javascript" src="../js/jquery.min.js"></script>
		<script type="text/javascript" src="../js/vue.min.js"></script>
        <script type="text/javascript" src="../js/element.min.js"></script>
        <script src="../js/viewer.min.js"></script>
	</head>
	<body>
        <div id="app" class="page-container" style="display: none;" v-show="showApp">
            <div class="contetn_box">
                <div class="top_box">
                    <div class="cell_box" style="width: 43.84vw;">
                        <div class="cell_title">
                            <div class="cell_name">基本信息:</div>
                            <div class="cell_but"></div>
                        </div>
                        <div class="cell_cont" style="height: 378px;">
                            <div class="form_box" style="margin-top: 0;">
                                <div class="form_name">进场单号</div>
                                <div class="form_cont">{{recordNumber}}</div>
                            </div>
                            <!-- <div class="form_box">
                                <div class="form_name">关联选项</div>
                                <div class="form_cont form_radios">
                                    <el-radio @change="radioChange" v-model="radio" label="1">无关联</el-radio>
                                    <el-radio @change="radioChange" v-model="radio" label="2">关联采购合同</el-radio>
                                    <el-radio @change="radioChange" v-model="radio" label="3">关联计划</el-radio>
                                </div>
                            </div>
                            <div class="form_box" v-if="radio == 2">
                                <div class="form_name">关联采购合同</div>
                                <div class="form_cont" style="padding-right: 10px;">
                                    <el-input disabled class="public_input" placeholder="请选择采购合同" v-model="contract.contractName"></el-input>
                                </div>
                                <div class="form_but">
                                    <el-button @click="chioceCght" class="border_but" type="primary">选择</el-button>
                                </div>
                            </div>
                            <div class="form_box" v-if="radio == 3">
                                <div class="form_name">关联计划</div>
                                <div class="form_cont" style="padding-right: 10px;">
                                    <el-input disabled class="public_input" placeholder="请选择计划" v-model="plan.planName"></el-input>
                                </div>
                                <div class="form_but">
                                    <el-button @click="chioceCgjh" class="border_but" type="primary">选择</el-button>
                                </div>
                            </div> -->
                            <div class="form_box">
                                <div class="form_name must_input">供应商</div>
                                <div class="form_cont" style="padding-right: 10px;">
                                    <el-tooltip class="item" effect="dark" :disabled="!supplier.supplierName" :content="supplier.supplierName" placement="top">
                                        <el-input disabled class="public_input" placeholder="请选择供应商" v-model="supplier.supplierName"></el-input>
                                    </el-tooltip>
                                </div>
                                <div class="form_but" style="width: 62px;">
                                    <el-button v-if="radio != 2 || !contract.contractId || (contract.contractId && (!supplier.supplierId || supplier.supplierId < 0))" @click="chioceGys" class="border_but" type="primary">选择</el-button>
                                </div>
                            </div>
                            <div class="form_box">
                                <div class="form_name">备注</div>
                                <div class="form_cont" style="padding-right: 10px;">
                                    <el-tooltip class="item" effect="dark" :disabled="!remarks" :content="remarks" placement="top">
                                        <el-input type="textarea" :rows="3" placeholder="请输入" v-model="remarks"></el-input>
                                    </el-tooltip>
                                </div>
                                <div class="form_but" style="width: 62px;">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cell_box" style="width: 46.94vw;float: right;">
                        <div class="cell_title">
                            <div class="cell_name">现场抓拍:</div>
                            <div class="cell_but">
                                <el-button @click="chioceGlimg" class="border_but" type="primary">关联</el-button>
                            </div>
                        </div>
                        <div class="cell_cont" style="height: 378px; padding: 0 1.67vw;">
                            <div class="file_item">
                                <el-upload
                                    action="##"
                                    accept="image/*"
                                    list-type="picture-card"
                                    :show-file-list="false"
                                    :http-request="zphttprequest"
                                    multiple>
                                    <i class="el-icon-plus"></i>
                                </el-upload>
                            </div>
                            <div class="file_item" v-for="(item, index) in glimgList" :key="index" style="border: 2px solid #999999;">
                                <img :src="item.fileurl" alt="">
                                <div class="file_mask">
                                    <div @click="prevewImg(item.fileurl)" class="el-icon-zoom-in"></div>
                                    <div @click="downImg(item.filename, item.fileurl)" class="el-icon-download" style="margin: 0 20px;"></div>
                                    <div @click="removeImg(glimgList, index)" class="el-icon-delete"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="padding-left: 3.34vw;margin-top: 30px;">
                    <div class="cell_title">
                        <div class="cell_name">送货单照片:</div>
                        <div class="cell_but">
                            <el-upload
                                class="upload-demo"
                                action="##"
                                accept="image/*"
                                multiple
                                :show-file-list="false"
                                :http-request="shdhttprequest">
                                <el-button class="border_but" type="primary">上传照片</el-button>
                            </el-upload>
                        </div>
                    </div>
                    <div class="cell_cont" style="width: 544px;">
                        <div class="table_box border_table_box">
                            <el-table :data="fileList" max-height="400px" border style="width: 100%">
                                
                                <el-table-column prop="filename" align="center" min-width="100" show-overflow-tooltip label="名称"></el-table-column>
                                
                                <el-table-column prop="userName" align="center" show-overflow-tooltip label="上传人" min-width="70">
                                </el-table-column>
    
                                <el-table-column prop="uploadTime" align="center" show-overflow-tooltip label="上传时间" width="160">
                                </el-table-column>

                                <el-table-column align="center" show-overflow-tooltip label="操作" width="140">
                                    <template slot-scope="scope">
                                        <el-button @click="prevewImg(scope.row.fileurl)" type="text">查看</el-button>
                                        <el-button @click="downImg(scope.row.filename, scope.row.fileurl)" type="text">下载</el-button>
                                        <el-button @click="removeImg(fileList, scope.$index)" type="text">删除</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="width: 100%; padding:0 1.84vw 0 3.34vw;margin-top: 30px;">
                    <div class="cell_title">
                        <div class="cell_name">订单明细:</div>
                        <div class="cell_but">
                            <!-- <el-button @click="chioceorder" class="border_but" type="primary">添加订单</el-button> -->
                        </div>
                    </div>
                    <div class="cell_cont">
                        <div v-for="(item, index) in allTableData" :key="index">
                            <div class="list_title" style="padding: 10px 0;display: flex;">
                                <div style="display: flex;align-items: center;color:#fff;background: #fa7355;border-radius: 4px;padding: 4px 10px;">
                                    <div>采购订单 {{item.orderNo}}</div>
                                    <!-- <div @click="removeImg(allTableData, index, 1)" class="el-icon-circle-close" style="margin-left: 20px;cursor: pointer;color:#fff;"></div> -->
                                </div>
                            </div>
                            <div class="table_box border_table_box" style="margin-bottom: 10px;">
                                <el-table :data="item.clmxList" border style="width: 100%" height="400">
                                    
                                    <el-table-column prop="materialName" align="center" min-width="100" show-overflow-tooltip label="名称"></el-table-column>
                                    <el-table-column prop="specsName" align="center" show-overflow-tooltip label="规格" min-width="70">
                                    </el-table-column>
                                    <el-table-column align="center" prop="manufacturer" show-overflow-tooltip label="生产厂家" min-width="140">
                                    </el-table-column>
                                    <el-table-column align="center" prop="showCpValue" show-overflow-tooltip label="进场车牌" min-width="140">
                                    </el-table-column>
                                    <el-table-column align="center" prop="count" show-overflow-tooltip label="进场数量" width="160">
                                    </el-table-column>
        
                                    <el-table-column prop="unit" align="center" show-overflow-tooltip label="单位" min-width="70">
                                    </el-table-column>
        
                                    <el-table-column prop="approachTime" align="center" show-overflow-tooltip label="进场时间" width="242">
                                    </el-table-column>

                                    <el-table-column align="center" show-overflow-tooltip label="存放位置" min-width="150">
                                        <template slot-scope="scope">
                                            <div >{{scope.row.storageName}} {{scope.row.goodsShelvesNumber}})</div>
                                        </template>
                                    </el-table-column>
    
                                    <!-- <el-table-column align="center" show-overflow-tooltip label="操作" width="106">
                                        <template slot-scope="scope">
                                            <el-button @click="removeImg(item.clmxList, scope.$index, 1)" type="text">删除</el-button>
                                        </template>
                                    </el-table-column> -->
                                </el-table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="width: 100%; padding:0 1.84vw 0 3.34vw;margin-top: 30px;">
                    <div class="cell_title">
                        <div class="cell_name">无订单进场明细:</div>
                        <div class="cell_but">
                            <!-- <el-button @click="chioceClmx" class="border_but" type="primary">添加材料</el-button> -->
                        </div>
                    </div>
                    <div class="cell_cont">
                        <div class="table_box border_table_box">
                            <el-table :data="clmxList" border style="width: 100%" height="400">
                                    
                                <el-table-column prop="materialName" align="center" min-width="100" show-overflow-tooltip label="名称"></el-table-column>
                                
                                <el-table-column prop="specsName" align="center" show-overflow-tooltip label="规格" min-width="70">
                                </el-table-column>
    
                                <el-table-column align="center" prop="count" show-overflow-tooltip label="进场数量" width="160">
                                </el-table-column>
    
                                <el-table-column prop="unit" align="center" show-overflow-tooltip label="单位" min-width="70">
                                </el-table-column>
    
                                <el-table-column prop="approachTime" align="center" show-overflow-tooltip label="进场时间" min-width="242">
                                </el-table-column>

                                <el-table-column align="center" show-overflow-tooltip label="存放位置" min-width="150">
                                    <template slot-scope="scope">
                                        <span v-if="!scope.row.isAdd && scope.row.storageId">{{scope.row.storageName}}<span v-if="scope.row.goodsShelvesNumber.length > 0">({{scope.row.goodsShelvesNumber}})</span></span>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="but_box">
				<el-button @click="cancels" class="cancelClass">取消</el-button>
				<el-button @click="confirms2" type="primary" style="margin-left: 120px">提交</el-button>
            </div>
            <ul id="jq22" style="opacity: 0;height: 0;overflow: hidden;">
                <li v-for="(item, index) in previewList" :key="index"><img :src="item" /></li>
            </ul>
        </div>
        <script src="../js/FileSaver.js"></script>
		<script src="../js/public.js?12345"></script>
		<script>
			var layer = layui.layer
			var vm = new Vue({
				el: '#app',
				data() {
					return {
                        showApp: false,
                        projectId: '',
                        companyId: '',
                        recordId: '',
                        radio: '1',
                        input: '',
                        contract: {
                            contractId: '',
                            contractName: ''
                        },
                        plan: {
                            planId: '',
                            planName: ''
                        },
                        supplier: {
                            supplierId: '',
                            supplierName: ''
                        },
                        remarks: '',
                        allTableData: [],
                        clmxList: [],
                        fileList: [],
                        glimgList: [],
                        previewList: [],
                        recordNumber: ''
					};
				},
				methods: {
                    chioceCj (item, row, index) {
                        var that = this
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择仓库货架',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['77.91%', '98.88%'],
                            // area: ['91.91%', '72.16%'],
                            content: '../publicList/ckList.html?isSingle=1'+ '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        row.manufacturerId = newList[0].id
                                        row.manufacturer = newList[0].name
                                        item.clmxList = row
                                        that.$forceUpdate()
                                        // that.$set(that.clmxList, index, row)
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 选择位置
                    chioceCk (item, row, index) {
                        var that = this
                        var selectArr = []
                        var materiaobj = {}
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择仓库货架',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['77.91%', '98.88%'],
                            // area: ['91.91%', '72.16%'],
                            content: '../publicList/ckList.html?isSingle=1&materiaobj='+ encodeURIComponent(JSON.stringify(materiaobj)) +'&projectId=' +  that.projectId + '&selectArr=' + encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        row.storageId = newList[0].id
                                        row.storageName = newList[0].name
                                        row.goodsShelvesNumber = newList[0].x_goodsShelvesNumber
                                        row.goodsShelvesId = newList[0].x_goodsShelvesId
                                        item.clmxList[index] = row
                                        that.$forceUpdate()
                                        // that.$set(that.clmxList, index, row)
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 选择位置
                    chioceCk2 (row, index) {
                        var that = this
                        var selectArr = []
                        for (var i = 0; i < this.clmxList.length; i++) {
                            selectArr.push({
                                id: this.clmxList[i].storageId,
                                number: this.clmxList[i].goodsShelvesNumber,
                            })
                        }
                        var materiaobj = {
                            materialId: row.materialId + '',
                            specsId: row.specificationId + ''
                        }
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择仓库货架',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['77.91%', '98.88%'],
                            // area: ['91.91%', '72.16%'],
                            content: '../publicList/ckList.html?isSingle=1&materiaobj='+ encodeURIComponent(JSON.stringify(materiaobj)) +'&projectId=' +  that.projectId + '&selectArr=' + encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        row.storageId = newList[0].id
                                        row.storageName = newList[0].name
                                        row.goodsShelvesNumber = newList[0].x_goodsShelvesNumber
                                        row.goodsShelvesId = newList[0].x_goodsShelvesId
                                        that.$set(that.clmxList, index, row)
                                    }
                                }, 10)
                            }
                        });
                    },
                    cancels () {
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index);
                    },
                    confirms2 () {
                        var that = this
                        xLoading(true, '正在校验')
                        console.log(that.plan.planId)
                        $.ajax({
                            type: 'post',
                            headers: {
                            },
                            url: baseUrl + '/Material/GetProjectInventoryStatus',
                            data: {
                                planId: that.plan.planId
                            },
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                if (res.data == 1) {
                                    that.$message({
                                        message: '盘点中，不可添加进场单',
                                        type: 'error'
                                    });
                                    return false
                                }
                                that.confirms1()
                            }
                        });
                    },
                    confirms1 () {
                        var that = this
                        if (this.supplier.supplierId.length == 0 || this.supplier.supplierId == 0) {
                            this.$message({
                                message: '请选择供应商',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        if (this.glimgList.length == 0) {
                            this.$message({
                                message: '请选择或者上传现场抓拍',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        
                        if (this.fileList.length == 0) {
                            this.$message({
                                message: '请上传送货单照片',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        var dataJson = []
                        for (var i = 0; i < this.allTableData.length; i++) {
                            dataJson.push({
                                purchaseOrderRecid: this.allTableData[i].recid,
                                purchaseOrderType: 1,
                                purchaseOrder: this.allTableData[i].orderNo,
                                buyPlanId: this.allTableData[i].buyPlanId,
                                purchaseMaterialDatas: this.allTableData[i].clmxList

                            })
                        }
                        dataJson.push({
                            purchaseOrderRecid: '',
                            purchaseOrderType: 2,
                            purchaseOrder: '',
                            buyPlanId: '',
                            purchaseMaterialDatas: this.clmxList

                        })
                        if (dataJson.length == 0) {
                            this.$message({
                                message: '请添加明细',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        for (var i = 0; i < this.clmxList.length; i++) {
                            if (!this.clmxList[i].storageId || this.clmxList[i].storageId == 0) {
                                this.$message({
                                    message: '无订单进场明细位置必须选择',
                                    type: 'warning',
                                    duration: 1000
                                });
                                return false
                            }
                        }
                        var pictureURL = []
                        var pictureId = []
                        var pictureUploadId = []
                        for (var i = 0; i < this.fileList.length; i++) {
                            pictureURL.push(this.fileList[i].fileid + ',' + this.fileList[i].filename + ',' + this.fileList[i].userName + ',' + this.fileList[i].uploadTime)
                        }
                        for (var i = 0; i < this.glimgList.length; i++) {
                            if (this.glimgList[i].types == 'upload') {
                                pictureUploadId.push(this.glimgList[i].fileid + ',' + this.glimgList[i].filename)
                            }
                            if (this.glimgList[i].types == 'glList') {
                                pictureId.push(this.glimgList[i].fileid)
                            }
                        }
                        
                        xLoading(true, '正在提交')
                        $.ajax({
                            type: 'post',
                            headers: {
                            },
                            url: baseUrl + 'Material/SaveApproachMatrtialData',
                            data: {
                                recordId: that.recid,
                                recordNumber: that.recordNumber,
                                planId: that.plan.planId,
                                contractName: that.contractName,
                                planName: that.planName,
                                supplierName: that.supplierName,
                                supplierId: that.supplier.supplierId,
                                remarks: that.remarks,
                                deliveryNotePic: pictureURL.join('|'),
                                approachCapturePic_Join: pictureId.join('|'),
                                approachCapturePic_Upload: pictureUploadId.join('|'),
                                dataJson: JSON.stringify(dataJson)
                            },
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.$message({
                                    message: '已提交',
                                    type: 'success'
                                });
                                setTimeout(function () {
                                    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                                    parent.layer.close(index);
                                }, 500)
                            }
                        });
                    },
                    radioChange () {
                        this.contract = {
                            contractId: '',
                            contractName: ''
                        }
                        this.plan = {
                            planId: '',
                            planName: ''
                        }
                        this.supplier = {
                            supplierId: '',
                            supplierName: ''
                        }
                    },
                    prevewImg (urls) {
                        this.previewList = [urls];
                        setTimeout(function () {
                            var viewer = new Viewer(document.getElementById('jq22'), {
                                hide: function () {
                                    viewer.destroy();
                                }
                            });
                            viewer.show();
                        }, 10);
                    },
                    downImg (filename, urls) {
                        publicdownFile(filename, urls)
                    },
                    removeImg (arr, index, types) {
                        var title = '此操作将永久删除该文件, 是否继续?'
                        if (types == 1) {
                            title = '此操作将永久删除该数据, 是否继续?'
                        }
                        this.$confirm(title, '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(function () {
                            arr.splice(index, 1)
                        }).catch(function () {
                        });
                    },
                    // 送货单上传
                    shdhttprequest (file) {
                        this.uploadImg(file, 2)
                    },
                    // 抓拍上传
                    zphttprequest (file) {
                        this.uploadImg(file, 1)
                    },
                    uploadImg (file, types) {
                        var that = this
                        if (getFileType(file.file.name) != 'IMG') {
                            this.$message({
                                message: '只能上传图片',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        xLoading(true, '正在上传')
                        var formData = new FormData();
						formData.append('files', file.file);
						$.ajax({
							type: 'post',
							url: baseUrl + '/Common/UploadFile?method=UploadFile&type=OSS',
							data: formData,
							dataType: 'json',
							contentType: false,
							processData: false,
							success: function(res) {
                                xLoading(false)
								if (!res.success) {
									that.$message({
										message: res.msg,
										type: 'error'
									});
									return false;
                                }
                                var newobj = {
                                    fileid: res.data.fileId,
                                    filename: res.data.fileName,
                                    fileurl: res.data.ossUrl,
                                    uploadTime: res.data.uploadTime,
                                    userName: res.data.userName,
                                    types: 'upload'
                                }
                                if (types == 1) {
                                    that.glimgList.push(newobj)
                                }
                                if (types == 2) {
                                    that.fileList.push(newobj)
                                }
							}
						});
                    },
                    // 选择关联照片
                    chioceGlimg () {
                        var that = this
                        var selectArr = []
                        for (var i = 0; i < this.glimgList.length; i++) {
                            if (this.glimgList[i].types == 'glList') {
                                selectArr.push({
                                    id: this.glimgList[i].fileid
                                })
                            }
                        }
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '关联抓拍',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['55.62%', '68.61%'],
                            content: '../publicList/imgList.html?projectId=' +  that.projectId + '&selectArr=' + encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        for (var j = 0; j < that.glimgList.length; j++) {
                                            for (var i = 0; i < newList.length; i++) {
                                                if (newList[i].id == that.glimgList[j].id) {
                                                    if (that.glimgList[j].types == 'glList') {
                                                        newList.splice(i, 1)
                                                    }
                                                }
                                            }
                                        }
                                        for (var i = 0; i < newList.length; i++) {
                                            that.glimgList.push({
                                                fileid: newList[i].id,
                                                filename: '抓拍图片' + newList[i].id +'.png',
                                                fileurl: newList[i].url,
                                                types: 'glList'
                                            })
                                        }
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 选择采购合同
                    chioceCght () {
                        var that = this
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择采购合同',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['60%', '77.77%'],
                            content: '../publicList/cghtList.html?isSingle=1&projectId=' +  that.projectId + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        that.contract = {
                                            contractId: newList[0].id,
                                            contractName: newList[0].title
                                        }
                                        that.supplier = {
                                            supplierId: newList[0].suppilerId,
                                            supplierName: newList[0].suppilerName
                                        }
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 选择采购计划
                    chioceCgjh () {
                        var that = this
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择采购计划',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['33.33%', '77.77%'],
                            content: '../publicList/cgjhList.html?isSingle=1&projectId=' +  that.projectId + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        that.plan = {
                                            planId: newList[0].id,
                                            planName: newList[0].title
                                        }
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 选择供应商
                    chioceGys () {
                        var that = this
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择供应商',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['60%', '77.77%'],
                            content: '../publicList/gysList.html?isSingle=1&companyId=' +  that.companyId + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        that.supplier = {
                                            supplierId: newList[0].id,
                                            supplierName: newList[0].name
                                        }
                                    }
                                }, 10)
                            }
                        });
                    },
                    
                    // 选择订单
                    chioceorder () {
                        var that = this
                        var selectArr = []
                        for (var i = 0; i < this.allTableData.length; i++) {
                            selectArr.push({
                                recid: this.allTableData[i].recid,
                                orderNo: this.allTableData[i].orderNo
                            })
                        }
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择订单',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['91.91%', '72.16%'],
                            content: '../publicList/cgddList.html?projectId=' +  that.projectId + '&selectArr=' + encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        var list = []
                                        for (var i = 0; i < newList.list.length; i++) {
                                            list.push({
                                                oper: 'add',
                                                isAdd: true,
                                                approachTime: timeFormat(new Date(), 1),
                                                materialId: newList.list[i].materialID,
                                                materialName: newList.list[i].materialName,
                                                specsId: newList.list[i].specificationId,
                                                specsName: newList.list[i].specificationName,
                                                unit: newList.list[i].unit,
                                                storageId: newList.list[i].warehouseId,
                                                storageName: newList.list[i].warehouseName,
                                                goodsShelvesId: newList.list[i].goodsShelvesId,
                                                goodsShelvesNumber: newList.list[i].goodsShelvesNumber,
                                                count: newList.list[i].approachQuantity,
                                                manufacturer: newList.list[i].manufacturer,
                                                manufacturerId: newList.list[i].manufacturerID
                                            })
                                        }
                                        that.allTableData.push({
                                            orderNo: newList.info.orderNo,
                                            recid: newList.info.recid,
                                            clmxList: list,
                                            buyPlanId: newList.info.buyPlanId
                                        })
                                    }
                                }, 10)
                            }
                        });
                    },
                    // 新增材料明细
                    chioceClmx () {
                        var that = this
                        var selectArr = []
                        for (var i = 0; i < this.clmxList.length; i++) {
                            selectArr.push({
                                materialId: this.clmxList[i].materialId,
                                specificationId: this.clmxList[i].specsId
                            })
                        }
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择材料明细',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['52.08%', '64.81%'],
                            content: '../publicList/clmxList.html?projectId=' +  that.projectId + '&selectArr=' + encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        for (var i = 0; i < newList.length; i++) {
                                            that.clmxList.push({
                                                oper: 'add',
                                                isAdd: true,
                                                materialId: newList[i].materialId,
                                                materialName: newList[i].materialName,
                                                specsId: newList[i].specificationId,
                                                specsName: newList[i].specificationName,
                                                unit: newList[i].unit,
                                                storageId: '',
                                                storageName: '',
                                                goodsShelvesNumber: '',
                                                count: 0,
                                                approachTime: timeFormat(new Date(), 1),
                                            })
                                        }
                                    }
                                }, 10)
                            }
                        });
                    },
                    getDetailData () {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
                            },
                            url: baseUrl + '/Material/GetAllApproachDatas',
                            data: {
                                id: that.recordId,
                                projectId: that.projectId
                            },
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.approachCode = res.data.approachCode
                                that.recordNumber = res.data.approachCode
                                that.supplier = {
                                    supplierId: res.data.supplierId,
                                    supplierName: res.data.supplierName
                                }
                                that.remarks = res.data.remarks
                                var fileList = []
                                var glimgList = []
                                if (res.data.deliveryNotePic) {
                                    for (var i = 0; i < res.data.deliveryNotePic.split('|').length; i++) {
                                        fileList.push({
                                            fileid: res.data.deliveryNotePic.split('|')[i].split(',')[0],
                                            filename: res.data.deliveryNotePic.split('|')[i].split(',')[1],
                                            fileurl: baseUrl + '/DataInput/FileService?method=DownloadFile&fileid=' + res.data.deliveryNotePic.split('|')[i].split(',')[0],
                                            uploadTime: res.data.deliveryNotePic.split('|')[i].split(',')[3],
                                            userName: res.data.deliveryNotePic.split('|')[i].split(',')[2]
                                        })
                                    }
                                }
                                if (res.data.approachCapturePic_Upload) {
                                    for (var i = 0; i < res.data.approachCapturePic_Upload.split('|').length; i++) {
                                        glimgList.push({
                                            fileid: res.data.approachCapturePic_Upload.split('|')[i].split(',')[0],
                                            filename: res.data.approachCapturePic_Upload.split('|')[i].split(',')[1],
                                            fileurl: baseUrl + '/DataInput/FileService?method=DownloadFile&fileid=' + res.data.approachCapturePic_Upload.split('|')[i].split(',')[0],
                                            types: 'upload'
                                        })
                                    }
                                }
                                if (res.data.approachCapturePic_Join) {
                                    for (var i = 0; i < res.data.approachCapturePic_Join.split('||').length; i++) {
                                        glimgList.push({
                                            fileid: res.data.approachCapturePic_Join.split('||')[i].split('|')[0],
                                            filename: '抓拍图片'+ res.data.approachCapturePic_Join.split('||')[i].split('|')[0] +'.png',
                                            fileurl: res.data.approachCapturePic_Join.split('||')[i].split('|')[1],
                                            types: 'glList'
                                        })
                                    }
                                }
                                that.fileList = fileList
                                that.glimgList = glimgList
                                that.allTableData = []
                                that.clmxList = []
                                for (var i = 0; i < res.data.purchaseOrderApproach.length; i++) {
                                    for (var j = 0; j < res.data.purchaseOrderApproach[i].purchaseMaterialDatas.length; j++) {
                                        if (res.data.purchaseOrderApproach[i].purchaseMaterialDatas[j].uuidlicensePlates) {
                                            var arrs = res.data.purchaseOrderApproach[i].purchaseMaterialDatas[j].uuidlicensePlates.split('|')
                                            var newarr = []
                                            for (var k = 0; k < arrs.length; k++) {
                                                newarr.push(arrs[k].split(',')[1])
                                            }
                                            res.data.purchaseOrderApproach[i].purchaseMaterialDatas[j].showCpValue = newarr.join(',')
                                        }
                                    }
                                    if (res.data.purchaseOrderApproach[i].purchaseOrderType == 1) {
                                        that.allTableData.push({
                                            orderNo: res.data.purchaseOrderApproach[i].purchaseOrder,
                                            recid: res.data.purchaseOrderApproach[i].purchaseOrderRecid,
                                            buyPlanId: res.data.purchaseOrderApproach[i].buyPlanId,
                                            clmxList: res.data.purchaseOrderApproach[i].purchaseMaterialDatas
                                        })
                                    }
                                    if (res.data.purchaseOrderApproach[i].purchaseOrderType == 2) {
                                        that.clmxList = res.data.purchaseOrderApproach[i].purchaseMaterialDatas
                                    }
                                }

                            }
                        });
                    }
				},
				mounted() {
                    var that = this
                    this.showApp = true;
                    // this.projectId = getQuerys('projectId')
                    // this.companyId = getQuerys('companyId')
                    // if (getQuerys('htObj')) {
                    //     var htObj = JSON.parse(decodeURIComponent(getQuerys('htObj')))
                    //     that.radio = '2'
                    //     that.contract = {
                    //         contractId: htObj.contractId ? htObj.contractId : '',
                    //         contractName: htObj.contractName ? htObj.contractName : ''
                    //     }
                    //     that.supplier = {
                    //         supplierId: htObj.supplierId ? htObj.supplierId : '',
                    //         supplierName: htObj.supplierName ? htObj.supplierName: ''
                    //     }
                    // }
                    this.recordId = getQuerys('recordId')
                    this.projectId = getQuerys('projectId')
                    this.companyId = getQuerys('companyId')
                    this.getDetailData()
				}
			});
		</script>
	</body>
	<style>
		.page-container {
            padding-bottom: 70px;
            position: relative;
        }
        .but_box {
            position: absolute;
            left: 0;
            bottom: 0;
        }
        .top_box {
            overflow: hidden;
            width: 100%;
            padding: 0 3.34vw;
            padding-top: 1.56vh;
        }
        .contetn_box {
            width: 100%;
            height: 100%;
            overflow: auto;
        }
        .cell_box {
            float: left;
            padding-bottom: 20px;
        }
        .cell_title {
            display: flex;
            align-items: center;
            padding: 10px 0;
            height: 52px;
        }
        .cell_but {
            padding-left: 10px;
        }
        .cell_cont {
            overflow: auto;
            padding: 2.77vh 2.08vw;
            border: 1px solid #EBEBEB;
        }
        .form_box {
            display: flex;
            width: 100%;
            margin-top: 20px;
        }
        .form_name {
            line-height: 32px;
            width: 94px;
            min-width: 94px;
            padding-right: 10px;
            text-align: right;
        }
        .form_cont {
            display: flex;
            align-items: center;
            line-height: 1;
            flex: 1;
            flex-wrap: wrap;
        }
        .el-radio {
            margin-right: 2.51vw;
            line-height: 32px;
        }
        .el-input.is-disabled .el-input__inner {
            background: #FAFBFC;
            color: #333333;
            border: 1px solid #BBBBC5;
        }
        .el-textarea__inner {
            background: #FAFBFC;
            border: 1px solid #BBBBC5;
        }
        .file_item {
            margin-left: 20px;
            margin-top: 20px;
            width: 140px;
            height: 140px;
            overflow: hidden;
            border-radius: 5px;
            float: left;
            position: relative;
        }
        .el-upload--picture-card {
            width: 100%;
            height: 100%;
            border-color: #D6D6D6;
            background: #FAFBFC;
        }
        .file_item > div {
            width: 100%;
            height: 100%;
        }
        .file_mask {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity 0.5s;
        }
        .file_mask > div {
            font-size: 22px;
            color: #fff;
            cursor: pointer;
        }
        .file_item:hover .file_mask {
            opacity: 1;
        }
        .txt_link > span{
            text-decoration: underline;
        }
	</style>
</html>
